<!doctype html>
<!-- 讲座系统的教师端页面 -->
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta http-equiv="Cache-Control" content="no-siteapp">
  <meta name="format-detection" content="telephone=no">
  <meta name="format-detection" content="email=no">
  <meta name="format-detection" content="address=no">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <title>家长成长学院直播间</title>
  <link rel="shortcut icon" href="" type="image/x-icon">
  <link href="https://cdn.bootcss.com/layer/3.0.1/mobile/need/layer.css?2.0" type="text/css" rel="styleSheet">
  <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
  <!-- <script src="https://cdn.jsdelivr.net/sockjs/1/sockjs.min.js"></script> -->
  <script type="text/javascript" src="https://cdn.bootcss.com/socket.io/1.7.3/socket.io.js"></script>
  <style media="screen">
    .xesLoading,body,html{height:100%}.reload_tips,.xesName,.xes_btn_RelLoad{position:absolute;text-align:center}html{font-size:62.5%;background:#eee}body{position:relative;line-height:1;font-family:"Microsoft Yahei";background-color:#fff;font-size:12px;color:#5d5b5b;min-width:320px;max-width:640px;margin:0 auto}ul{list-style:none;padding:0}.xesLoading{position:absolute;display:block;top:0;bottom:0;z-index:10;width:100%;background:#fff;overflow:hidden}.logoBox{position:absolute;display:block;top:100px;left:50%;width:64px;height:40px;background-color:#9CCC65!important;margin:0 0 0 -32px;border-radius:8px}.xesName{top:150px;font-size:1.5rem;color:#a7a7a7;width:100%}@-webkit-keyframes qlanime{0%,100%,85%{height:10px;margin-top:-5px}40%{height:30px;margin-top:-15px}80%{height:14px;margin-top:-7px}}@keyframes qlanime{0%,100%,85%{height:10px;margin-top:-5px}40%{height:30px;margin-top:-15px}80%{height:14px;margin-top:-7px}}@-webkit-keyframes qlanime1{0%,100%,85%{height:20px;margin-top:-10px}20%{height:30px;margin-top:-15px}60%{height:10px;margin-top:-5px}80%{height:16px;margin-top:-8px}}@keyframes qlanime1{0%,100%,85%{height:20px;margin-top:-10px}20%{height:30px;margin-top:-15px}60%{height:10px;margin-top:-5px}80%{height:16px;margin-top:-8px}}@-webkit-keyframes qlanime2{0%,100%,85%{height:30px;margin-top:-15px}40%{height:10px;margin-top:-5px}80%{height:26px;margin-top:-13px}}@keyframes qlanime2{0%,100%,85%{height:30px;margin-top:-15px}40%{height:10px;margin-top:-5px}80%{height:26px;margin-top:-13px}}.logoBox li{display:inline-block;position:absolute;top:50%;right:32px;background-color:#fff;height:10px;width:4px;margin-top:-5px;border-radius:4px}
    .logoBox li:nth-child(1){margin-right:14px;height:10px;margin-top:-5px}.logoBox li:nth-child(2){margin-right:6px;height:20px;margin-top:-10px}.logoBox li:nth-child(3){margin-right:-2px;height:30px;margin-top:-15px}.logoBox li:nth-child(4){margin-right:-10px;height:20px;margin-top:-10px}.logoBox li:nth-child(5){margin-right:-18px;height:10px;margin-top:-5px}.logoBox li:nth-child(1),.logoBox li:nth-child(5){animation:qlanime .7s cubic-bezier(.72,.41,.41,.68) .1s alternate infinite;-moz-animation:qlanime .7s cubic-bezier(.72,.41,.41,.68) .1s alternate infinite;-webkit-animation:qlanime .7s cubic-bezier(.72,.41,.41,.68) .1s alternate infinite}.logoBox li:nth-child(2),.logoBox li:nth-child(4){animation:qlanime1 .7s cubic-bezier(.72,.41,.41,.68) .1s alternate infinite;-moz-animation:qlanime1 .7s cubic-bezier(.72,.41,.41,.68) .1s alternate infinite;-webkit-animation:qlanime1 .7s cubic-bezier(.72,.41,.41,.68) .1s alternate infinite}.logoBox li:nth-child(3){animation:qlanime2 .7s cubic-bezier(.72,.41,.41,.68) .1s alternate infinite;-moz-animation:qlanime2 .7s cubic-bezier(.72,.41,.41,.68) .1s alternate infinite;-webkit-animation:qlanime2 .7s cubic-bezier(.72,.41,.41,.68) .1s alternate infinite}#xes_btn_RelLoad_box{display:none}.reload_tips{top:220px;font-size:1.2rem;color:#b4b4b4;width:100%}.xes_btn_RelLoad{top:260px;left:50%;width:60px;height:30px;margin-left:-30px;line-height:30px;border:1px solid #e5e5e5;background:#fff;color:#9CCC65;border-radius:3px;font-size:15px}
  </style>

  <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
  <div class="xesLoading">
      <ul class="logoBox"><li></li>   <li></li>   <li></li>   <li></li>   <li></li></ul>
      <div class="xesName">学而思</div>
      <div id="xes_btn_RelLoad_box">
          <div class="reload_tips">卡住了？刷新一下～</div>
          <a class="xes_btn_RelLoad" href="javascript:;" onclick="if(/\?/.test(window.location.href))window.location.href = (window.location.href).replace(/(\&?)(restime\=)(\w+)/,'')+'&restime='+new Date().getTime();else window.location.href = (window.location.href).replace(/(\&?)(restime\=)(\w+)/,'')+'?restime='+new Date().getTime();">刷新</a>
      </div>
  </div>

  <div class="page-body flex-body hasTabBottom" style="display:none;">
    <div class="flex-main">
        <div class="flex-body">
            <ul class="pageMenu">
                <li class="li-tab-control controlBox">操作</li>
                <li class="btn_frist_msg btnFristMsg icon_up_3"></li>
                <li class="btn_new_msg icon_down_3"></li>
                <li class="mine-exit">
                    <a href="/broad/user/#/user"></a>
                </li>
            </ul>
            <!-- 弹幕 -->
            <div class="barrage_control on">
                <div class="black_bar">
                    <ul class="main">
                        <li class="barrage_tab btn_tab_1 icon_enter_2"></li>
                        <li class="allcount btn-mgr-commnet"><var id="xesOLPeople" class="qlOLPeople"></var>人在线</li>
                        <li class="tabToComment">聊天室</li>
                    </ul>
                </div>
            </div>
            <div class="danmuBox" style="display: block;">
                <dl class="lucky-money-bullet">
                    <dd class="lmb-item"><var class="money"></var>
                            <span class="msg">
                                <b class="b-one"></b>
                                <b class="b-two"></b>
                            </span>
                        <img class="head" alt="">
                    </dd>
                </dl>
                <dl class="danmulist">

                </dl>
            </div>
            <div class="flex-main">
                <div class="live-back-wrap"></div>
                <div class="speakContentBox">
                    <div class="scrollContentBox">
                        <span id="audioSpan"></span>

                        <div class="qlTopicHeadBox qlTimerShow">
                            <div class="ql_start_box">
                                <div class="name">如何更快更好地开发一款适合幼小学生表达能力训练的产品。</div>
                                <div class="ql_start_date ">
                                  <span class="qlStartDate">本次直播于2017-03-15 10:00:00开始</span>
                                </div>
                                <!-- <div class="ql-s-bottom ">
                                  <a href="javascript:;" class="ticketPush" data-thistopicid="270000274511169">推送直播</a>
                                  <a href="/live/invite/topicList/310000045145155/270000274511169.htm">邀请嘉宾</a>
                                </div> -->
                            </div>
                            <!-- <dl class="shareList_dl">   <dt>
                                        <b>影响力排行榜</b>
                                    </dt>
                                <div class="get-share-card-box">    <a class="myShareCard" href="javascript:;">邀请朋友一起听课，强势上榜</a>
                                </div>
                            </dl> -->
                            <!-- 干聊固定密码引导 -->
                            <ul class="topic_tips_dl topicTipsDl">
                                <a href="javascript:;" class="btn_close_topic_tips icon_cross btnCloseTopicTips"></a>   <span class="title">听课指南</span>

                                <li>听不到声音请往下翻，点击语音即可播放，并确认手机没有静音。</li>
                                <li>点击右上角回到顶部或底部。</li>
                                <li>课程语音永久保留，无限复听</li>
                                <li>遇到卡顿和加载不出，点返回，重新进入即可</li>
                            </ul>
                        </div>
                        <dl id="BubblesTemp" class="bubbles_dl"></dl>
                        <!--直播间、系列课二维码-->
                        <!-- <dl id="qr_bubbles_item" class="bubbles_dl" hidden="">
                            <dd class="left_bubble">
                                <div class="speak_time"></div>
                                <div class="head_portrait">
                                    <img src="https://img.qlchat.com/qlLive/liveCommon/liveHead.png@300w_300h_1e_1c_2o">
                                </div>
                                <div class="speaker_name">  <b>纪广财的直播间4kix6u</b></div>
                                <div class="bubble_content topic-top-tip">
                                    <div class="bubble_content_main">
                                        <p>本课程所属直播间: <span class="main-color-text">纪广财的直播间4kix6u</span></p>
                                        <a href="/live/310000045145155.htm" class="bubble_qrcode_link">点击查看所有课程</a>
                                    </div>
                                </div>
                            </dd>
                        </dl> -->
                        <!--信息流-->
                        <dl id="speakBubbles" class="bubbles_dl">
                            <!-- <dd class="left_bubble hasTime" attr-id="270000274511171" data-fileid="undefined" attr-time="1489542899000" attr-createby="120000111494497">
                                <div class="speak_time">03-15 09:54</div>
                                <div class="head_portrait">
                                    <img src="{$testLogo}">
                                </div>
                                <div class="speaker_name"><b>纪广财</b>主持人</div>
                                <div class="bubble_content  green_bubble">
                                    <div class="bubble_content_main">
                                        <p>恭喜你成功进入直播间！</p>
                                    </div>
                                    <div class="play-box">
                                        <div class="zan" data-id="270000274511171"><b class="icon_praise"></b><span class="count"></span>
                                        </div><a class="btn_revoke" href="javascript:;" onmicspeak="false">撤回</a>
                                    </div>
                                </div>
                            </dd>
                            <dd class="left_bubble hasTime" attr-id="260000285581758" data-fileid="undefined" attr-time="1489560624000" attr-createby="120000111494497">
                                <div class="speak_time">03-15 14:50</div>
                                <div class="head_portrait">
                                    <img src="{$testLogo}">
                                </div>
                                <div class="speaker_name"><b>纪广财</b>主持人</div>
                                <div class="bubble_content recordingMsg recordwid1 green_bubble isReaded isReading isPlaying audioloading">
                                    <div class="bubble_content_main">
                                      <i class="audio_info icon_audio_play" attr-src="https://media.qlchat.com/qlLive/audio/EVIN6LWR-QU2P-DMNJ-1493350882462-8QM9IE2J7847"></i>
                                      <span class="audio-bar-area"><span class="front-bar"></span><span class="block" data-second="1" data-current="0″"><b></b></span></span><var>1″</var>
                                    </div>
                                    <div class="play-box">
                                        <div class="zan" data-id="260000285581758"><b class="icon_praise"></b><span class="count"></span>
                                        </div><a class="btn_revoke" href="javascript:;" onmicspeak="false">撤回</a>
                                    </div>
                                </div>
                            </dd>
                            <dd class="left_bubble hasTime" attr-id="220000416158076" data-fileid="undefined" attr-time="1492920058000" attr-createby="120000111494497">
                                <div class="speak_time">04-23 12:00</div>
                                <div class="head_portrait">
                                    <img src="{$testLogo}">
                                </div>
                                <div class="speaker_name"><b>纪广财</b>主持人</div>
                                <div class="bubble_content  img_bubble">
                                    <div class="bubble_content_main">
                                        <img src="https://img.qlchat.com/qlLive/liveComment/T1Y8WKU1-LDUU-ICHS-1492920039767-A6T9CMZZRSLU.jpg@240h_1e_1c_2o">
                                    </div>
                                    <div class="play-box">
                                        <div class="zan" data-id="220000416158076"><b class="icon_praise"></b><span class="count"></span>
                                        </div><a class="btn_revoke" href="javascript:;" onmicspeak="false">撤回</a>
                                    </div>
                                </div>
                            </dd> -->
                        </dl>
                    </div>
                </div>
            </div>
            <div class="transparent backContentBox"></div>
            <div class="transparent recing_bg"></div>
        </div>
        <div class="commentBox isShow">
            <div class="commentHeader"> <a class="backToLive" href="javascript:;">回到直播</a></div>
            <div class="commentContentBox">
                <div class="btn_load_history btnLoadComment"><i></i></div>
                <div class="scrollContentBox">
                    <dd class="comment_count"><span class="icon_consult"></span>讨论(<span id="commentNum">0</span>)</dd>
                    <div class="none_pic5 none_record" id="loadNone" style="display: none;"><span class="none_tip">在此处留言或提问～</span></div>
                    <dl id="commentDlTemp" class="comment_dl"></dl>
                    <dl id="commentDl" class="comment_dl">

                    </dl>
                    <div class="box_nothing" style="display:block;"><span class="tips_1">没有更多</span>
                    </div>
                </div>
            </div>
        </div>
        <div class="mic-and-typing">
            <!--半透明正在输入小弹窗-->
            <div class="inputing_areowindow">
                <p><span id="input_person_name"></span>正在输入...</p>
            </div>
        </div>
    </div>
    <div id="speakBottom" class="speakBottom flex-other">
        <ul class="tab_bar_ul tab_speak">
            <li class="tab_voice icon_mic">语音<b class="first_record" hidden=""><i></i>点击开始语音讲课</b></li>
            <li class="tab_text icon_keyboard">文字</li>
            <li class="tab_media icon_medias">媒体库</li>
            <li class="btn_mLibrary icon_ppt">素材库</li>
        </ul>
        <div class="recording_tab_box">
            <dl class="recording_click" onmousedown="return false">
                <dd class="btn_dd ">
                    <i></i>
                    <div id="btnStartRec" class="btn_recording start_rec" onmousedown="return false"></div>
                    <div id="btnStopRec" class="btn_recording stop_rec" onmousedown="return false"></div>
                    <div id="btnSentRec" class="btn_recording send_rec" onmousedown="return false"><b onmousedown="return false">点击发送</b></div>
                    <div id="btnCancelRec" class="btn_cancel_clickRec" onmousedown="return false">取消</div>
                    <div id="btnCheckRec" class="btn_check_clickRec" onmousedown="return false">试听</div>
                    <div id="btnAgainRec" class="btn_again_clickRec" onmousedown="return false">重录</div>
                </dd>
            </dl>
            <dl class="recording_box">
                <dd class="btn_dd"> <i></i>

                    <div id="btnRecording" class="btn_recording"></div>
                </dd>
                <!--<dd class="tips_dd">按住说话</dd>-->
            </dl>   <span class="second_dd"><i></i><var>0</var>s/60s<i></i></span>
        <span class="rec_Title_box" onmousedown="return false"><b>点击一下录音</b><b>按住说话</b></span>
        <span class="rec_Title_box replyMic"><b>点击回复<var>caicai</var></b><b></b></span>
            <!--普通用户上麦录音的提示语 -->    <span class="tab_recordingType">
                    <a class="recType_1" href="javascript:;">单击</a><a class="recType_2" href="javascript:;">长按</a>
                </span>
        </div>
        <div class="text_input_box">
          <span class="boxFlex">
              <b class="ql_input_front"></b>
              <textarea class="speakInput" placeholder="请输入内容" placeholder-cache=""></textarea>
          </span>
          <i class="btnLiveTalk" onmousedown="return false">发送</i>
        </div>
        <div class="media_box">
          <div id="filePicker">
            <span class="icon_pictures btnImgUpload" style="overflow: hidden; position: relative;">图片
                <!-- <input type="file" onmousedown="return false" name="file" id="file"
                    accept="image/jpg,image/jpeg,image/png,image/gif,image/bmp"
                    style="position: absolute; right: 0px; bottom: 0px; opacity: 0; margin: 0px; padding: 0px; font-size: 480px; cursor: pointer; z-index: 10;"> -->
            </span>
          </div>

          <!-- <span id="btnUploadMP3" class="icon_records btnUploadMP3">音频</span>
          <span class="icon_videos btnInsertVideo">视频</span>
          <span class="icon_upload_file" id="upload-file">文件</span> -->
        </div>
        <div class="recordingTips rTips_1">录满60秒将自动发送并启动下一条录音</div>
        <div class="recordingTips rTips_2"><var>3</var>秒后将自动发出</div>
        <div class="recordingTips rTips_3">手指划出此区域，取消发送</div>
        <div class="recordingTips rTips_4">松开手指，取消录音</div>
        <div class="recordingTips rTips_5">发送后即可录制下一条</div>
    </div>


    <div class="bottom-comment-box flex-other" style="display: none;">
    	<div id="teacher_comment" class="bottom_content_area webkitBox newCommentBox ">
    		<!-- <span class="btn-tab-control controlBox" style="">操作</span> -->
    		<textarea class="input-box boxFlex auto_height" attr-minheight="35" placeholder="加入一起讨论..."></textarea>
    		<span class="btn_ask" onmousedown="return false"><i></i>提问</span>
    		<span class="submit" onmousedown="return false">发送</span>
    	</div>
    </div>
  </div>


  <div class="ppt-select-layer" id="ppt-select-layer" style="display:none;">
		<header>
			<a href="javascript:;" id="ppt-close-btn">返回主屏</a>
		</header>
		<section class="main_box_1">
			<p class="ppt-select-layer-tip">点击图片即可在直播中放出图片，省去上传的时间</p>
			<ul class="ppt-select-list"></ul>
		</section>
		<footer>
					<span href="javascript:;" class="" id="ppt-add-btn"><i class="icon_plus ppt-add-icon"></i>上传图片素材</span>
		</footer>
	</div>


  <div class="caozuo_box" style="display:none;">
		<b class="cbBg"></b>
		<div class="collecttips" style="display:none;">点击<i class="icon_dots_horizontal"></i>收藏即可<b class="icon_arrow"></b></div>
		<!-- <div class="backtips" style="display:none;">点击<i class="icon_dots_vertical"></i>在浏览器中打开，进行后台收听<b class="icon_arrow"></b></div> -->
		<div class="czbox_main" style="max-height: 45rem;">
			<!-- <div class="guest_list_box">
				<dl class="guest_list">
					<dd attr-id="270000274511173">
									<span class="guest_img"><img src="https://img.qlchat.com/qlLive/userHeadImg/74AC7FB1-3047-4096-822B-A24FC7F20502-0S0SU4JJF9.jpg@132h_132w_1e_1c_2o"></span>
									<span class="guest_title">
								<var class="guest_title_1">纪广财</var>
								<var class="guest_title_2">主持人</var>
						</span>
					</dd>
				</dl>
			</div> -->
			<dl class="caozuo_list">
					<!-- <dd class="caozuo_guest"><a href="/live/invite/topicList/310000045145155/270000274511169.htm"><b class="cz_logo icon_couple"></b>邀请嘉宾</a></dd>
					<dd class="caozuo_set"><a href="/live/topic/modify.htm?topicId=270000274511169&amp;liveId=310000045145155"><b class="cz_logo icon_settings"></b>密码设置</a></dd> -->
					<dd class="caozuo_shutup "><b class="cz_logo icon_ban"></b>禁言模式</dd>
						<!-- <dd class="caozuo_dao"><a href="javascript:;" class="getrecord_btn_0">
							<b class="cz_logo icon_loading"></b>
							<b class="cz_logo icon_download"></b>
							<b class="cz_logo icon_cancel"></b>
							<b class="cz_logo icon_moveout"></b>
							<i>导出语音</i>
							</a></dd> -->
				<dd class="caozuo caozuo_zidong"><b class="cz_btn"><a id="btnAutoPlay" class="btn_switch"></a></b>自动播放</dd>
				<dd class="caozuo_cang"><a href="javascript:;" class="shoucang_btn"><b class="cz_logo icon_heart_sting"></b>收藏</a></dd>
				<dd class="caozuo_intro"><a href=""><i class="cz_logo icon_page"></i>直播介绍</a></dd>
				<!-- <dd class="caozuo_over"><a class="btn_finish_live" href="javascript:;"><b class="cz_logo icon_record_stop"></b>结束直播</a></dd>
				<dd class="caozuo_whisper tabTowhisper" attr-whisperask="Y"><a href="/live/whisper/list.htm?topicId=270000274511169"><i class="cz_logo icon_whisper"></i>私问</a></dd>
				<dd class="shared-file"><a href="/topic/common.html?#/document/270000274511169" id="shared-file-btn"><b class="icon_remote_file cz_logo"></b>共享文件</a></dd> -->
				<dd class="caozuo_refresh" onclick="if(/\?/.test(window.location.href))window.location.href = (window.location.href).replace(/(\&amp;?)(restime\=)(\w+)/,'')+'&amp;restime='+new Date().getTime();else window.location.href = (window.location.href).replace(/(\&amp;?)(restime\=)(\w+)/,'')+'?restime='+new Date().getTime();"><i class="cz_logo icon_refresh"></i>刷新</dd>
				<!-- <dd class="caozuo caozuo_show_lk_money"><b class="cz_btn"><a id="btnShowMoney" class="btn_switch  "></a></b>红包消息</dd> -->
			</dl>
		</div>
	</div>

  <div class="geneBox commentReplyBox" data-key="" style="display: none;">
		<div class="main">
			<div class="gene_content">
				<textarea class="reply_textarea" placeholder="点击发送后，回复内容会同步到直播主屏。回复内容可以为空" onkeyup=" if($(this).val().length >= 2000) $(this).val($(this).val().substr(0,2000))" placeholder-cache=""></textarea>
			</div>
			<div class="gene_bottom both">
				<span><a href="javascript:;" class="gene_btn gene_cancel">取消</a></span>
				<span><a href="javascript:;" class="gene_btn gene_confirm">确定</a></span>
			</div>
		</div>
	</div>


</body>

<script type="text/javascript">
  $(function(){
    window.app = {};
    app.dynamicLoadingJs=function(e,d){var c=document.createElement("script");var b=document.getElementsByTagName("head")[0];c.src=e;if(typeof d==="function"){var a;c.onload=c.onreadystatechange=function(){if(!a&&(!c.readyState||/loaded|complete/.test(c.readyState))){c.onload=c.onreadystatechange=null;a=true;d()}}}b.appendChild(c)};

    app.resPath = 'http://cdn.gzpeiyou.com/single/';
    if(location.href.indexOf('/topic')>-1){
      app.resPath = '../view/dist/';
    }

    app.dynamicLoadingJs(app.resPath+'js/topic/init.js?bust='+new Date().getTime());
  });


</script>
</html>
